layui.use(['element','form','table','upload'],function(){
    var upload = layui.upload;
    var table = layui.table;
    var form = layui.form;

    var productNumber = location.hash.substring(1);

    table.render({
        initSort: {
            field: 'priceData' //排序字段，对应 cols 设定的各字段名
            ,type: 'desc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
        },
        elem: '#demo'
        ,toolbar: '#toolbarDemo'
        ,url: '/proPrice' //数据接口
        ,page: true //开启分页
        ,where:{
            productNumber
        }
        ,cols: [[ //表头
            {field: 'priceId',title: '产品编号',hide:true, sort: true}
            ,{field: 'productNumber', title: '产品编号', align: "center", templet: "#pro_pic",width:170 }
            ,{field: 'priceData',title: '日期', sort: true}
            ,{field: 'priceStartTime', title: '开始时间'}
            ,{field: 'priceEndTime', title: '结束时间'}
            ,{field: 'priceTypeName', title: '价格类型'}
            ,{field: 'price',title: '价格'}
        ]]
        ,id : "price"
    });


    //头部工具栏监听事件--导入
    table.on('toolbar(test)', function(obj){
        var checkStatus = table.checkStatus(obj.config.id);
        switch(obj.event){
            case 'import':
                var display = document.getElementById('upload').getAttribute('display')
                if(display === '0'){
                    $('#upload').show();
                    $('#upload').attr('display','1');
                }else{
                    $('#upload').hide();
                    $('#upload').attr('display','0');
                }
                break;
        };
    });

    //多文件列表示例
    var demoListView = $('#demoList')
        ,uploadListIns = upload.render({
        elem: '#testList'
        ,url: '/proPrice/import' //改成您自己的上传接口
        ,accept: 'file'
        ,multiple: true
        ,auto: false
        ,bindAction: '#testListAction'
        ,choose: function(obj){
            var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
            //读取本地文件
            obj.preview(function(index, file, result){
                var tr = $(['<tr id="upload-'+ index +'">'
                    ,'<td>'+ file.name +'</td>'
                    ,'<td>'+ (file.size/1024).toFixed(1) +'kb</td>'
                    ,'<td>等待上传</td>'
                    ,'<td>'
                    ,'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
                    ,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
                    ,'</td>'
                    ,'</tr>'].join(''));

                //单个重传
                tr.find('.demo-reload').on('click', function(){
                    obj.upload(index, file);
                });

                //删除
                tr.find('.demo-delete').on('click', function(){
                    delete files[index]; //删除对应的文件
                    tr.remove();
                    uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                });

                demoListView.append(tr);
            });
        }
        ,done: function(res, index, upload){
            if(res.code === '0'){ //上传成功
                var tr = demoListView.find('tr#upload-'+ index)
                    ,tds = tr.children();
                tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
                tds.eq(3).html(''); //清空操作

                var table = layui.table;
                table.reload('price', {
                });

                return delete this.files[index]; //删除文件队列已经上传成功的文件
            }
            this.error(index, upload);
        }
        ,error: function(index, upload){
            var tr = demoListView.find('tr#upload-'+ index)
                ,tds = tr.children();
            tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
            tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
        }
    });

});